{% extends 'bootstrap-modal-layout.html.twig' %}

{% block title %}{{'my.teaching.question_bank.create'|trans}}{% endblock %}

{% do script(['libs/jquery-validation.js', 'libs/select2.js', 'app/js/question-bank/create/index.js']) %}

{% block body %}
  <div id="bank-creater-widget">

    <form id="bank-form" class="form-horizontal" action="{{ path('question_bank_create') }}" method="post">
      <div class="form-group">
        <label class="col-md-2 control-label" for="bank-name">{{'admin.question_bank.manage.name_label'|trans}}</label>
        <div class="col-md-8 controls">
          <input class="form-control" id="bank-name" type="text" name="name" value="" tabindex="1" placeholder="{{ 'my.teaching.question_bank.name_tip'|trans }}">
        </div>
      </div>

      <div class="form-group">
        <label class="col-md-2 control-label" for="bank-category">{{'admin.question_bank.manage.category_label'|trans}}</label>
        <div class="col-md-8 controls">
          <select style="width:150px;" class="form-control" name="categoryId" required="required" id="bank-category">
            <option value="">{{'admin.question_bank.manage.category'|trans}}</option>
            {% for tree in categoryTree %}
              <option value={{ tree.id }}>{% for i in 1..(tree.depth-1) if tree.depth > 1 %}　{% endfor %}{{ tree.name }}</option>
            {% endfor %}
          </select>
        </div>
      </div>

      <input type="hidden" name="_csrf_token" value="{{ csrf_token('site') }}">
    </form>
  </div>

{% endblock %}

{% block footer %}
  <button type="button" class="btn btn-link" data-dismiss="modal" tabindex="6">{{'form.btn.cancel'|trans}}</button>
  <button id="create-btn" data-submiting-text="{{'form.btn.submit.submiting'|trans}}" type="submit" class="btn btn-primary" data-toggle="form-submit" data-target="#bank-form" tabindex="4">{{'form.btn.save'|trans}}</button>
{% endblock %}